import React, { Component, PropTypes } from 'react';
import { Select } from 'antd';
import * as commonService from '../../services/CommonCRUD';

const Option = Select.Option;

const SearchInput = React.createClass({
  getInitialState() {
    return {
      data: [],
      value: '',
    };
  },
  componentDidMount() {
    let whereCause = {}
    whereCause.RelationSign = "OR";
    whereCause.WhereItems = [];
    const { valueTpl, value } = this.props;
    whereCause.WhereItems.push({ FieldName: valueTpl, Operator: '=', FieldValues: value })
    if (value !== '') {
      this.fetch(whereCause)
    }
  },
  componentWillReceiveProps(nextProps) {
    if (!nextProps.value) {
      if (this.state.state !== "") {
        this.setState({ value: "" });
      }
    }
  },
  handleSelect(value, option) {
    this.props.onChange(value);
    if (this.props.onSelect) {
      const sData = this.getSelectData(value)
      this.props.onSelect(sData)
    }
    this.setState({ value: option.props.children });
  },
  getSelectData(value) {
    const data = this.state.data;
    const ID = this.props.valueTpl;
    let selectData = null;
    for (let i = 0; i < data.length; i++) {
      if ('' + data[i][ID] === value) {
        selectData = data[i]
        break;
      }
    }
    return selectData;
  },
  fetch(whereCause, value) {
    const { daoName, optionTpl, permID } = this.props;
    commonService.fetch({ daoName, page: 1, pageSize: 5, sorter: null, filters: [whereCause], permID: permID }
    ).then(function (data) {
      if (value === undefined && data.Objectlist.length > 0) {
        value = data.Objectlist[0][optionTpl]
      }
      this.setState({ data: data.Objectlist, value });
    }.bind(this)).catch(function (ex) {
      console.log('请求出错', ex)
    });
  },
  handleChange(value) {
    if (value === '') {
      return;
    }
    let result;
    if (!value || value.replace(/(^\s*)|(\s*$)/g, '') === '') {
      result = [];
    } else {
      const { daoName, optionTpl, searchColumns } = this.props
      let whereCause = {}
      whereCause.RelationSign = "OR";
      whereCause.WhereItems = [];
      let sc = searchColumns
      if (!sc) {
        sc = [optionTpl];
      }
      sc.map(c => whereCause.WhereItems.push({ FieldName: c, Operator: 'like', FieldValues: value }))
      this.fetch(whereCause, value)
    }
  },
  render() {
    const { valueTpl, optionTpl, placeholder } = this.props;
    const { data, value } = this.state;
    const options = this.state.data.map(d => <Option key={d[valueTpl]} value={'' + d[valueTpl]}>{d[optionTpl]}</Option>);
    return (
      <Select
        combobox
        value={value}
        placeholder={this.props.placeholder}
        defaultActiveFirstOption={false}
        showArrow={false}
        filterOption={false}
        onSearch={this.handleChange}
        onSelect={this.handleSelect}
      >
        {options}
      </Select>
    );
  },
});

SearchInput.propTypes = {
  daoName: PropTypes.string,
  valueTpl: PropTypes.string,
  optionTpl: PropTypes.string,
  searchColumns: PropTypes.array,
  placeholder: PropTypes.string,
  onSelect: PropTypes.func
};
SearchInput.defaultProps = {
  placeholder: "请输入..."
};
export default SearchInput;